.y-scoring-view

  //TODO duplicated from views. Refactor.
  .y-tag
    font-size 11px
    text-transform uppercase
    display inline-block
    background y-color-yellow
    padding 3px 5px

  //TODO duplicated from views. Refactor.
  .y-tagline
    color #888
    font-size 12px
    float right

  //TODO duplicated from views. Refactor.
  .y-title
    font-size 36px
    font-weight 300

  //TODO duplicated from views. Refactor.
  .y-subtitle
    font-size 22px
    font-weight 300
    margin-top 35px

  .y-subheading
    font-size 18px
    font-weight 300
    margin-top 20px

  .y-model-summary
    margin-bottom 15px

  .y-legend-label
    cursor pointer

  .y-legend-swatch
    display inline-block
    size(12px)

  .y-roc-curve
    font-size 10px
    color #888
    .axis
      fill none
      stroke #777
      shape-rendering crispEdges
    .dot
      fill #777
      stroke none
    .line
      fill none
      stroke #999
      stroke-width 1.5px
    .guide
      fill none
      stroke red

  .y-custom-plot
    font-size 10px
    color #888
    .axis
      fill none
      stroke #777
      shape-rendering crispEdges
    .dot
      fill transparent
      stroke-width 1.5px
      stroke none
      cursor pointer
    .line
      fill none
      stroke #999
      stroke-width 1.5px
    .guide
      fill none
      stroke red

  .y-metrics-plot
    font-size 10px
    color #888
    .axis
      fill none
      stroke #777
      shape-rendering crispEdges
    .dot
      fill transparent
      stroke-width 1.5px
      cursor pointer

  .y-multi-roc-curve
    font-size 10px
    color #888
    .axis
      fill none
      stroke #777
      shape-rendering crispEdges
    .dot
      fill transparent
      stroke-width 1.5px
      stroke none
      cursor pointer
    .line
      fill none
      stroke #999
      stroke-width 1.5px
    .guide
      fill none
      stroke red

  .y-strip-plot
    font-size 10px
    color #888
    .line
      path
        fill none
        stroke-width 1px
    .axis
      fill none
      stroke #777
      shape-rendering crispEdges
    .strip
      fill none
      stroke-width 2px
      shape-rendering crispEdges
      cursor pointer
    .guide
      fill none
      stroke #ddd
      stroke-width 1px
      shape-rendering crispEdges
    .labels
      cursor pointer

  .y-criteria-comparison
    width 340px
    margin-top 20px
    table
      width 100%

  .y-diff
    padding 0 5px
    background y-color-yellow

  .y-link
    color y-color-hyperlink
    font-size 85%
    text-decoration underline
    text-transform none
    cursor pointer

  .y-expert
    display none
      
  // HACK
  .y-indent
    padding-left 20px !important

  .y-sorted-asc
    border-bottom: 2px solid y-color-green

  .y-sorted-desc
    border-bottom: 2px solid y-color-blue

  .y-visualization
    position relative
    width 290px
    height 260px
    border y-border-transparent

    .y-rendering
      position absolute
      left 0
      top 0

    .y-controls
      position absolute
      width 32px
      height 52px
      right 0
      top 0
      border y-border-light
      box-shadow-light()

      button
        background transparent
        width 30px
        height 25px
        padding 0
        &:hover
          background #eee

  .y-visualization-container
    .y-controls
      display none
    &:hover
      .y-visualization
        border y-border-light
        box-shadow-light()
      .y-controls
        display block






